﻿<%@ Page Language="C#" MasterPageFile="~/bbs/mbbs.master" AutoEventWireup="true" 
CodeBehind="searchbroker.aspx.cs" Inherits="map.bbs.searchbroker" Title="搜索经纪人" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head2" runat="server">
    <link href="/outstyle.css" rel="stylesheet" type="text/css" />
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <link href="/Stylesheet1.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        *
        {
            margin: 0px 0px 0px 0px;
            padding: 0px 0px 0px 0px;
        }
        .style1
        {
            width: 100%;
        }
        .style2
        {
            width: 200px;
            vertical-align: top;
        }
        .itemcateSelectDiv, .shopcateSelectDiv
        {
            padding: 5px 0px 5px 0px;
            text-align: left;
        }
        .itemcateSelectDiv select, .shopcateSelectDiv select
        {
            width: 180px;
        }
        .itemcateSelectUl
        {
            list-style-type: none;
        }
        .ErrorMsgP
        {
            border: solid 1px red;
            background-color: #FFF2F2;
            width: 150px;
            margin-top: 3px;
        }
        .labelMarkerStyle
        {
            color: white;
            text-align: center;
            height: 21px;
            padding-top: 7px;
            position: relative;
            width: 50px;
        }
        .labelInfoWindowStyle
        {
            width: 200px;
            height: 200px;
            display: none;
        }
        div.labelMarkerCommDivRight
        {
            background: url(/img/lable_mask_right_150x28.png) no-repeat;
            position: absolute;
            border: none;
            margin: 0px 0px 0px 0px;
            padding: 0px 0px 0px 0px;
            width: 150px;
            height: 28px;
            background-position: 0px 0px;
        }
        .labelMarkerCommSpan
        {
            line-height: 32px;
            vertical-align: middle;
            color: White;
        }
        #labelMarkerCanvasExtInfoWindow
        {
            background-color: lightGray;
            color: Red;
            position: relative;
            border: solid 1px blue;
            width: 325px;
            height: 50px;
        }
        .searchInputTextBox
        {
            background: url(/img/glass.gif) no-repeat;
            padding-left: 20px;
        }
        #simple_example_window
        {
            width: 330px;
        }
        #simple_example_window_contents
        {
            background-color: #FFF;
        }
        #simple_example_window_beak
        {
            width: 28px;
        }
        * html #simple_example_window_beak
        {
            /* Alpha transparencies hack for IE */
            background-image: none; <%--filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src= 'images/corners/red_beak.png',sizingMethod='crop');--%>}
        #simple_example_window_close
        {
            width: 31px;
            height: 31px;
            background: url(   "/img/close_20x20.png" ) left 10px no-repeat;
            cursor: pointer;
        }
        #simple_example_window_tl
        {
            background: url(   '/img/panel.tl_15x15.png' ) no-repeat;
            width: 15px;
            height: 15px;
        }
        #simple_example_window_bl
        {
            background: url(   '/img/panel.bl_15x15.png' ) no-repeat;
            width: 15px;
            height: 15px;
        }
        #simple_example_window_br
        {
            background: url(   '/img/panel.br_15x15.png' ) no-repeat;
            width: 15px;
            height: 15px;
        }
        #simple_example_window_tr
        {
            background: url(   '/img/panel.tr_15x15.png' ) no-repeat;
            width: 15px;
            height: 15px;
        }
        #simple_example_window_l
        {
            background: url(   '/img/panel.l_15x15.png' );
            width: 15px;
        }
        #simple_example_window_r
        {
            background: url(   '/img/panel.r_15x15.png' );
            width: 15px;
        }
        #simple_example_window_t
        {
            background: url(   '/img/panel.t_15x15.png' );
        }
        #simple_example_window_b
        {
            background: url(   '/img/panel.b_15x15.png' );
        }
    </style>


    <script src="/js/dropdowncontent.js" type="text/javascript"></script>

    <script src="/js/JScript1.js" type="text/javascript"></script>

    <script src="/js/dom-drag.js" type="text/javascript"></script>

    <script type="text/javascript"> 
            //----设置Cookie------


        
        
 function selarea1(a) {      
    var result = AjaxFunction.Getselarea1(a) ;
    if(result!=null && result.value!=null)
    {
        document.getElementById("area4").innerHTML=result.value;
    }
}
function selarea2(a) {
    var result = AjaxFunction.Getselarea2(a);
    if (result != null && result.value != null) {
        var s = result.value.split("|");
        document.getElementById("ctl00_ctl00_ContentPlaceHolder1_ContentPlaceHolder3_Label_currentposition").value = s[3];
        map.clearOverlays();
        map.setCenter(new GLatLng(s[2], s[1]), 14);
        var point1 = new GLatLng(s[2], s[1]);
        var marker1 = new GMarker(point1);
        GEvent.addListener(marker1, "click", function() {
            marker1.openInfoWindowHtml("标注此位置");
        });
        map.addOverlay(marker1);
        if (s[0] == "0") {
            var s1 = confirm("你还未登录,现在花半分钟注册以获得更好的用户体验?");
            if (s1 == true) {
                window.location.href = "/member/regist1.aspx?area4id=" + a + "&long=" + s[1] + "&lat=" + s[2];
                return 0;
            }
        }
    }
}


    </script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder3" runat="server">
<asp:Literal ID="Literal_map" runat="server"></asp:Literal>
    <table id="zyj" class="style1">
        <tr>
            <td class="style2">
                <div style="width: 200px;">
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>

                            <div id="searchButtonDiv">
                                <input type="text" value="" class="searchInputTextBox" id="TextBox_key" runat="server"
                                    style="width: 130px;" />
                                <input type="button" value="搜索" onclick="searchs();" />
                            </div>

                            <br />
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </div>
            </td>
            <td style="width: 2px;">
            </td>
            <td style="vertical-align: top;">
                <div id="map_canvas" style="width: 100%; height: 600px; border-color: Gray; border-width: 1px;
                    border-style: solid;">
                </div>
            </td>
        </tr>
    </table>
    <div id="dragdivinmap" style="position: absolute; top: 100px; left: 275px; border-style: solid;
        border-width: 1px; border-color: #FAA041; background-color: #FCFBCC;">
        <img src="/img/icon.idea_16x16.gif" />
        位置导航:<asp:Label ID="Label_currentposition" runat="server" Text="未定义"></asp:Label><a
            href="http://pages.f980.com/" id="contentlink3" rel="subcontent3" rev="/selarea.aspx">[切换位置]</a>
    </div>
    <div id="subcontent3" style="position: absolute; visibility: hidden; border: 1px solid Gray;
        background-color: White; width: 400px; height: 300px; padding: 4px; z-index: 100;
        overflow-y: scroll; filter: alpha(opacity=76); /*ie*/ 
          -moz-opacity: 0.76; /*moz , ff*/ 
          opacity: 0.76; /*css3, ff1.5*/">
    </div>

    <script src="/js/extinfowindow_packed.js" type="text/javascript"></script>

    <script src="/js/labeledmarker_packed.js" type="text/javascript"></script>

    <script type="text/javascript">
        dropdowncontent.init("contentlink3", "right-bottom", 300, "click");
    </script>

    <script type="text/javascript">
        var contentTemPrefix = "ctl00_ctl00_ContentPlaceHolder1_ContentPlaceHolder3_";
        Drag.init(document.getElementById("dragdivinmap"));

        geocoder = window.geocoder || (new GClientGeocoder());
        map = window.map || (new GMap2(document.getElementById("map_canvas")));
        function moveMapToAddress(address) {
            if (geocoder) {
                geocoder.getLatLng(
                        (address == "吉林") ? "吉林省" : address,
                        function(point) {
                            if (!point) {
                                alert("不能解析: " + address);
                            } else {
                                map.setCenter(point, 10);
                                document.getElementById("contentlink3").rev = "/selarea.aspx";
                            }
                        }
                );
            }
        }
        function moveMapToPlace() {
            var lat = 0;
            var lng = 0;
            var recid =  AjaxFunction.GetCurrentUserRECId().value;
            var result = AjaxFunction.getUserLocation(recid);
            if (result.value != null && result.value != "") {
                var user = eval("("+result.value+")");
                lat = user.lat;
                lng = user.lng;
            }
            var point = new GLatLng(lat, lng);
            map.setCenter(point, 13);
            var marker = new GMarker(point);
            map.addOverlay(marker);
        }

        function ShowCurrentState() {
            var result = AjaxFunction.getCurrentState().value;
            alert(result);
        }

        function initMapToUserLocation() {
            if (map) {
                var province = "";
                var result = AjaxFunction.getCurrentState();
                if (result.value != null && result.value != "") {
                    province = result.value;
                }
                if (province == "")
                    province = "北京";
                var zuserid = AjaxFunction.GetCurrentUserId() ;
                if (zuserid.value == "")
                {
                    moveMapToAddress(province);
                } else
                {
                    moveMapToPlace();
                }
            }            
        }

        window.onload = function() {
            initialize();
            initMapToUserLocation();
            
            mapUtil.init();
            searchs();
            setKeyDownSearch("ctl00_ctl00_ContentPlaceHolder1_ContentPlaceHolder3_TextBox_key");
        }
        
        //设置回车搜索功能
        function setKeyDownSearch(textId) {         
            var textEle = document.getElementById(textId);
            if (textEle != null && typeof (textEle .onkeydown)!=undefined ) {
                textEle.onkeydown = function(o) {
                    o = o || window.event;
                    if (o.keyCode == "13") {
                        searchs();
                        clearEventBubble(o);
                    }
                }
            }
        }
        
 
        //搜索
        function searchs() {
                if (map) {
                    map.closeExtInfoWindow();
                    map.clearOverlays();
                }
                //搜索关键字
                var searchKeys = document.getElementById(resolveServerControlId("TextBox_key")).value;

                //当前 左右经纬度
                var bounds = map.getBounds();
                var southWest = bounds.getSouthWest();
                var northEast = bounds.getNorthEast();
                var rightLat = southWest.lat();
                var leftLng = southWest.lng();
                var rightLng = northEast.lng();
                var leftLat = northEast.lat();

                var searchResult = AjaxFunction.searchBroker(searchKeys, leftLat , leftLng ,  rightLat ,  rightLng );
                if (searchResult.value != null && searchResult.value != "") {
                    var searchList = eval(searchResult.value);
                    for (var i = 0; i < searchList.length; i++) {
                        mapUtil.createLabelMarker(searchList[i],  searchKeys);
                    }
                }
        }

        function resolveServerControlId(id) {
            return contentTemPrefix + id;
        }

        mapUtil = window.mapUtil || {};
        mapUtil = {
            _searchTimeOut: null,
            _infoWindowTimeOut: null,
            commDiv: null,
            allowSearchs: false,
            createLabelMarker: function(obj,  searchKeys) {
                if (map) {
                    var icon = new GIcon();
                    icon.image = '/img/lable_normal_50x40.png';
                    icon.iconSize = new GSize(50, 40);
                    icon.iconAnchor = new GPoint(25, 40);
                    icon.infoWindowAnchor = new GPoint(20, 0);
                    var _title = "";
                    var _labelText = "";
                        _title = "在 " + obj.area + " 共找到" + obj.count.toString() + "个经纪人";
                        _labelText = "<span>" + obj.count.toString() + " </span>个";


                    opts = {
                        "icon": icon,
                        "clickable": true,
                        "title": _title,
                        "labelText": _labelText,
                        "labelOffset": new GSize(-25, -40),
                        "labelClass": "labelMarkerStyle"
                    };
                    var marker = new LabeledMarker(new GLatLng(obj.lat, obj.lng), opts);

                    GEvent.addListener(marker, "click", function() {
                        mapUtil.hideCommDiv();
                        mapUtil.hoverMarker(marker, false);
                        marker.openExtInfoWindow(
                          map,
                          "simple_example_window",
                          "<div>" + obj.area + "</div><div>loading...</div>"
                        );
                        map.savePosition();
                        mapUtil._infoWindowTimeOut = window.setTimeout(function() {
                            mapUtil.updateCanvasExtInfoWindow(marker, obj,  searchKeys)
                        }, parseInt(obj.count / 50) * 500 + 500);

                    });
                    GEvent.addListener(marker, "mouseover", function() {
                        var point = map.fromLatLngToContainerPixel(marker.getLatLng());
                        mapUtil.updateCommDivName(point.y, point.x, obj.area);
                        mapUtil.hoverMarker(marker, true);
                    });
                    GEvent.addListener(marker, "mouseout", function() {
                        mapUtil.hideCommDiv();
                        mapUtil.hoverMarker(marker, false);
                    });
                    map.addOverlay(marker);
                }
            },
            init: function() {
                this.commDiv = document.createElement("div");
                this.commDiv.className = "labelMarkerCommDivRight";
                this.commDiv.style.visibility = "hidden";
                document.body.appendChild(this.commDiv);
                if (map) {
                    GEvent.addListener(map, "dragstart", function() {
                        mapUtil.allowSearchs = false;
                    });
                    GEvent.addListener(map, "dragend", function() {
                        mapUtil.allowSearchs = true;
                        mapUtil.fireSearch();
                    });
                    GEvent.addListener(map, "zoomstart", function() {
                        mapUtil.allowSearchs = false;
                    });
                    GEvent.addListener(map, "zoomend", function() {
                        mapUtil.allowSearchs = true;
                        mapUtil.fireSearch();
                    });
                    GEvent.addListener(map, "movestart", function() {
                    });
                    GEvent.addListener(map, "moveend", function() {
                        mapUtil.fireSearch();
                    });
                    GEvent.addListener(map, "extinfowindowopen", function() {
                        mapUtil.allowSearchs = false;
                        clearTimeout(mapUtil._infoWindowTimeOut);
                    });
                    GEvent.addListener(map, "extinfowindowclose", function() {
                        mapUtil.allowSearchs = true;
                        map.returnToSavedPosition();
                    });
                }
            },
            updateCommDivName: function(top, left, name) {
                var mapCovas = document.getElementById("map_canvas");
                this.commDiv.innerHTML = "";
                var spanEle = document.createElement("span");
                spanEle.innerHTML = name;
                spanEle.style.height = "28px";
                spanEle.className = "labelMarkerCommSpan";
                this.commDiv.appendChild(spanEle);
                this.commDiv.style.left = left + mapCovas.offsetLeft + 20 + "px";
                this.commDiv.style.top = top + mapCovas.offsetTop - 39 + "px";
                this.commDiv.style.width = name.length * 7 + 20 + "px";
                this.commDiv.style.visibility = "visible";
                this.commDiv.style.backgroundPosition = (name.length * 7 + 20) - 150 + "px 0px";

            },
            hoverMarker: function(marker, isHide) {
                if (isHide == true) {
                    marker.setImage("/img/lable_hover_50x40.png");
                    var zIndex = GOverlay.getZIndex(-90);
                    marker.div_.style.zIndex = zIndex;
                    this.commDiv.style.zIndex = zIndex + 1;
                    try {
                        marker.yr.style.zIndex = zIndex
                    } catch (C) {
                    }
                    map.disableDragging();
                }
                else {
                    marker.setImage("/img/lable_normal_50x40.png");
                    var zIndex = GOverlay.getZIndex(marker.getLatLng().lat());
                    marker.div_.style.zIndex = zIndex;
                    try {
                        marker.yr.style.zIndex = zIndex;
                    } catch (C) {
                    }
                    map.enableDragging()
                }
            },
            hideCommDiv: function() {
                this.commDiv.innerHTML = "";
                this.commDiv.style.visibility = "hidden";
            },
            updateCanvasExtInfoWindow: function(marker,  pointObj, searchKeys) {
                var height = ((pointObj.count >= 4) ? 320 : 200);
                var iframeSrc = "";

                    iframeSrc = "/bbs/pointbroker.aspx";


                iframeSrc += "?id=" + pointObj.id + "&lat=" + pointObj.lat.toString() + "&lng=" + pointObj.lng.toString() + "&area=" + encodeURI(pointObj.area);
                iframeSrc += "&searchKeys=" + encodeURI(searchKeys) ;


                map.closeExtInfoWindow();
                marker.openExtInfoWindow(
                          map,
                          "simple_example_window",
                          "<div><iframe src=\"" + iframeSrc + "\" scrolling=\"no\" height=\"" + height + "px\" width=\"100%\" frameborder=\"0\" marginwidth =\"0\"></iframe></div>"

                        );
            },

            fireSearch: function() {

                clearTimeout(mapUtil._searchTimeOut);
                if (!mapUtil.allowSearchs)
                    return;
                mapUtil._searchTimeOut = window.setTimeout(function() {
                    searchs(); //alert(10);
                    map.savePosition();
                }, 500);
            }

        };

        function clearEventBubble(evt) {
            evt = evt || window.event;

            if (evt.stopPropagation) {
                evt.stopPropagation();
            } else {
                evt.cancelBubble = true;
            }

            if (evt.preventDefault) {
                evt.preventDefault();
            } else {
                evt.returnValue = false;
            }

        } 
        
    </script>
    <script type="text/javascript">
    function subInit() {
        $("#aidbbs").removeClass("actived");
        $("#aidbroker").addClass("actived");
    }
    jQuery(function($) {
        // 你可以在这里继续使用$作为别名...
    $("#aidbbs").removeClass("actived");
    $("#aidbroker").addClass("actived");
    });
    </script>
    <div class="copyright">
        <hr />
        2009 版权所有 CangBaoWang.net <a target="_blank" href="http://www.miibeian.gov.cn" linkindex="17">
            京ICP证090680号</a>
    </div>
</asp:Content>
